import Vue from 'vue'
import VueRouter from 'vue-router'

// 导入 components
import Main from '../views/Main.vue'
import UserList from '../views/User/UserList.vue'
import UserProfile from '../views/User/UserProfile.vue'
import Login from '../views/Login.vue'
import Error from '../views/404/Error.vue'


Vue.use(VueRouter);

export default new VueRouter({
  mode: 'history', // 路由配置: 跳转 url, 不带 /#/...
  routes: [{ // Main
      path: '/main',
      component: Main,
      children: [ // 嵌套 router
        {
          // name 是 "String", 用于【别名 访问path】
          name: 'UserProfile',
          // 多参数 = path: '/userProfile/:id/:name/:password'
          path: '/userProfile/:id', // 传入【一个参数 id】
            // path 有 2种写法 = /:id 或者 :id , 更加推荐【/:id 】 写法
          component: UserProfile,
          props: true // 允许【传递参数 放在 props域】
        },
        {
          path: '/userList',
          component: UserList
        },
      ]
    },
    { // Login
      path: '/login',
      component: Login

    },
    { // 重定向
      path: '/goHome',
      redirect: '/main' // 重定向到【首页】
    },
    { // 404
      path: '*', // 匹配所有【不存在 routes:[] 中的】
      component: Error
    }

  ]
});
